<!DOCTYPE html>
<html lang="en">
<link href="../c/base.css" rel="stylesheet" type="text/css">
<link href="../c/toefl.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="../c/bootstrap.min.css">
<script type="text/javascript" src="../j/jquery-2.1.0.js"></script>
<script src="../j/bootstrap.min.js"></script>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--头-->
<div class="doc1180">
	<div class="header">
    	<div class="logo"><a href="####"><img src="../i/logo.png"></a></div>
        <div class="headerLink">
        	<a href="../login.html" class="###">登录</a>
            <a href="../register.html" class="###">注册</a>
        </div>
    </div>
</div>
<div class="menu">
	<div class="doc1180">
   	  <div class="menuLink">
        	<ul class="fn-clear">
            	<li class="active"><a href="../index.html" >首页</a></li>
                <li><a href="托福人.html" >托福人</a></li>
                <li><a href="公开课首页.html" >公开课</a></li>
                <li><a href="chat.html" >群组聊</a></li>
                <li><a href="福利城堡-福利城堡.html">福利城堡</a></li>
            </ul>
        </div>
    </div>
</div>
<!--头-->
<div class="doc1180 fn-clear paddingT20">
    <!--左-->
    <div class="doc230 fn-left">
        <div class="flcb_cardUser">
            <div class="flcb_cardUserPic"><a href="###"><img src="../i/flcb_cardUserPic.png" width="100" height="100"></a></div>
            <div class="flcb_cardUserName"><a href="###">会员名字</a></div>
            <div class="flcb_cardUserText"><a href="###">文字文字请限制字数</a></div>
        </div>
        <div class="flcb_cardUserInfo">
            <div>你现在拥有的RPB：<span class="green">50</span></div>
            <div>你现在的等级是：学弱</div>
            <div><span>下一等级：</span>学孙<span>还差RPB：80</span></div>
            <div><a href="###" style="color: red;">充值兑换(模拟测试，不需要制作)</a></div>
        </div>
        <div class="flcb_cardUserMenu">
            <ul>
                <li><a href="../my/mydata.html" target="infor" class="icon_1">个人资料</a></li>
                <li><a href="个人中心我的公开课.html" target="infor" class="icon_2">我的公开课</a></li>
                <li class="on"><a href="个人中心我的群组.html" target="infor" class="icon_3">我的群组</a></li>
                <li><a href="个人中心我的福利城堡.html" target="infor" class="icon_5">我的福利城堡</a></li>
                <li><a href="个人中心我的托福人.html" target="infor" class="icon_6">我的托福人</a></li>
            </ul>
        </div>
    </div>
    <!--右-->
    <div class="doc910 fn-right">
        <div class="flcb_cardMenu">
            <ul>

                <li class="on">
                    <a href="###" id="myJoin">我加入的群</a>
                </li>
                <li>
                    <a href="###" id="myCreate">我建立的群</a>
                </li>
                <li>
                    <a href="###" id="create">我要建群</a>
                </li>
            </ul>
        </div>

        <div id="myJoinContent">
            <div class="flcb_myGroup">
                <dl>
                    <dt><a href="#"><img src="../i/82x82.png"></a></dt>
                    <dd>
                        <div class="flcb_myGroupClass">
                            <h3>托福英语口语强化班<span>同城考生群</span></h3>
                            <div class="flcb_cardNum"><span>12345</span>人购买</div>
                        </div>
                        <div class="flcb_myGroupTime">上课时间：<span>2015-10-29</span><span>12:30--15:30</span><span>群主：123456</span></div>
                        <div class="flcb_myGroupText">曾经有一份真诚的爱情摆在我的面前我没有去珍惜，直到现在才...</div>
                        <div class="flcb_cardButton">
                            <a href="../群组聊/组群聊-群聊页.html" target="_parent">进群聊天</a>
                            <a href="../群组聊/组群聊-群组详细页.html" target="_parent">群信息</a>
                            <a href="###" data-toggle="modal" data-target=".modal">申请做群管理员</a>
                            <a href="###">退出该群</a>
                        </div>
                    </dd>
                </dl>
                <dl>
                    <dt><a href="#"><img src="../i/82x82.png"></a></dt>
                    <dd>
                        <div class="flcb_myGroupClass">
                            <h3>托福英语口语强化班<span>同城考生群</span></h3>
                            <div class="flcb_cardNum"><span>12345</span>人购买</div>
                        </div>
                        <div class="flcb_myGroupTime">上课时间：<span>2015-10-29</span><span>12:30--15:30</span><span>群主：123456</span></div>
                        <div class="flcb_myGroupText">曾经有一份真诚的爱情摆在我的面前我没有去珍惜，直到现在才...</div>
                        <div class="flcb_cardButton">
                            <a href="../群组聊/组群聊-群聊页.html">进群聊天</a>
                            <a href="../群组聊/组群聊-群组详细页.html" target="_parent">群信息</a>
                            <a href="###" data-toggle="modal" data-target=".modal">申请做群管理员</a>
                            <a href="###">退出该群</a>
                        </div>
                    </dd>
                </dl>
                <dl>
                    <dt><a href="#"><img src="../i/82x82.png"></a></dt>
                    <dd>
                        <div class="flcb_myGroupClass">
                            <h3>托福英语口语强化班<span>同城考生群</span></h3>
                            <div class="flcb_cardNum"><span>12345</span>人购买</div>
                        </div>
                        <div class="flcb_myGroupTime">上课时间：<span>2015-10-29</span><span>12:30--15:30</span><span>群主：123456</span></div>
                        <div class="flcb_myGroupText">曾经有一份真诚的爱情摆在我的面前我没有去珍惜，直到现在才...</div>
                        <div class="flcb_cardButton">
                            <a href="../群组聊/组群聊-群聊页.html">进群聊天</a>
                            <a href="../群组聊/组群聊-群组详细页.html" target="_parent">群信息</a>
                            <a href="###" data-toggle="modal" data-target=".modal">申请做群管理员</a>
                            <a href="###">退出该群</a>
                        </div>
                    </dd>
                </dl>
            </div>
            <div class="pageList">
                <ul>
                    <li><span>1</span></li>
                    <li>
                        <a href="###">2</a>
                    </li>
                    <li>
                        <a href="###">3</a>
                    </li>
                    <li>
                        <a href="###">4</a>
                    </li>
                    <li>
                        <a href="###">5</a>
                    </li>
                    <li>
                        <a href="###">最后一页</a>
                    </li>
                    <li>
                        <a href="###" class="pret">上一页</a>
                    </li>
                    <li>
                        <a href="###" class="next">下一页</a>
                    </li>
                </ul>
            </div>

        </div>

        <div id="myCreateContent" style="display: none;">
            <div class="flcb_myGroup">
                <dl>
                    <dt><a href="#"><img src="../i/82x82.png"></a></dt>
                    <dd>
                        <div class="flcb_myGroupClass">
                            <h3>托福英语口语强化班<span>同城考生群</span></h3>
                            <div class="flcb_cardNum"><span>12345</span>人购买</div>
                        </div>
                        <div class="flcb_myGroupTime">上课时间：<span>2015-10-29</span><span>12:30--15:30</span><span>群主：123456</span></div>
                        <div class="flcb_myGroupText">曾经有一份真诚的爱情摆在我的面前我没有去珍惜，直到现在才...</div>
                        <div class="flcb_cardButton">
                            <a href="../群组聊/组群聊-群聊页.html">进群聊天</a>
                            <a href="../群组聊/组群聊-群组详细页.html" target="_parent">群信息</a>
                            <a href="../群组聊/组群聊-编辑群.html" target="_parent">编辑资料</a>
                            <a href="###">退出系统管理员</a>
                            <a href="###">关闭群</a>
                        </div>
                    </dd>
                </dl>
                <dl>
                    <dt><a href="#"><img src="../i/82x82.png"></a></dt>
                    <dd>
                        <div class="flcb_myGroupClass">
                            <h3>托福英语口语强化班<span>同城考生群</span></h3>
                            <div class="flcb_cardNum"><span>12345</span>人购买</div>
                        </div>
                        <div class="flcb_myGroupTime">上课时间：<span>2015-10-29</span><span>12:30--15:30</span><span>群主：123456</span></div>
                        <div class="flcb_myGroupText">曾经有一份真诚的爱情摆在我的面前我没有去珍惜，直到现在才...</div>
                        <div class="flcb_cardButton">
                            <a href="../群组聊/组群聊-群聊页.html">进群聊天</a>
                            <a href="../群组聊/组群聊-群组详细页.html" target="_parent">群信息</a>
                            <a href="../群组聊/组群聊-编辑群.html" target="_parent">编辑资料</a>
                            <a href="###">退出系统管理员</a>
                            <a href="###">关闭群</a>
                        </div>
                    </dd>
                </dl>
                <dl>
                    <dt><a href="#"><img src="../i/82x82.png"></a></dt>
                    <dd>
                        <div class="flcb_myGroupClass">
                            <h3>托福英语口语强化班<span>同城考生群</span></h3>
                            <div class="flcb_cardNum"><span>12345</span>人购买</div>
                        </div>
                        <div class="flcb_myGroupTime">上课时间：<span>2015-10-29</span><span>12:30--15:30</span><span>群主：123456</span></div>
                        <div class="flcb_myGroupText">曾经有一份真诚的爱情摆在我的面前我没有去珍惜，直到现在才...</div>
                        <div class="flcb_cardButton">
                            <a href="../群组聊/组群聊-群聊页.html">进群聊天</a>
                            <a href="../群组聊/组群聊-群组详细页.html" target="_parent">群信息</a>
                            <a href="../群组聊/组群聊-编辑群.html" target="_parent">编辑资料</a>
                            <a href="###">退出系统管理员</a>
                            <a href="###">关闭群</a>
                        </div>
                    </dd>
                </dl>
            </div>

            <div class="pageList">
                <ul>
                    <li><span>1</span></li>
                    <li>
                        <a href="###">2</a>
                    </li>
                    <li>
                        <a href="###">3</a>
                    </li>
                    <li>
                        <a href="###">4</a>
                    </li>
                    <li>
                        <a href="###">5</a>
                    </li>
                    <li>
                        <a href="###">最后一页</a>
                    </li>
                    <li>
                        <a href="###" class="pret">上一页</a>
                    </li>
                    <li>
                        <a href="###" class="next">下一页</a>
                    </li>
                </ul>
            </div>

        </div>

        <div id="createContent" style="display: none;">
            <form class="form-horizontal">
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">选择群类别</label>
                    <div class="col-sm-10">
                        <select name="" class="form-control">
                            <option>同城考生群</option>
                            <option>网络考生群</option>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">群名称</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="" placeholder="名称">
                    </div>
                </div>

                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">上传群头像</label>
                    <div class="col-sm-10">
                        <div class="flcb_cardBuildZp"><img src="../i/240x240.png" width="240" height="240"></div>
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">群介绍</label>
                    <div class="col-sm-10">
                        <textarea class="form-control">此处是群介绍</textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">群规则</label>
                    <div class="col-sm-10">
                        <textarea class="form-control">此处是群规则</textarea>
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-success">确定</button>
                        <button type="reset" class="btn btn-warning">重置</button>
                    </div>
                </div>
            </form>



        </div>

        <div class="modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">连接信息</h4>
                    </div>
                    <div class="modal-body">
                        <div class="layerQzBody">
                            <div class="layerQzH3">本群是&nbsp;同城考生群&nbsp;&nbsp;帝都杀托好青年都在这里</div>
                            <div class="layerQzText"><span>群管理员共有： 4 个</span> 现在有：3 个</div>
                            <div class="layerQzForm">
                                <textarea name="" cols="" rows="" class="layerQzInput">为什么要做群管理？</textarea>
                                <a class="layerQzButton" href="###">提交审核</a>
                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary">保存</button>
                    </div>
                </div>
                <!-- /.modal-content -->
            </div>
            <!-- /.modal-dialog -->
        </div>
    </div>
</div>
</body>
</html>